<template>
	<view class="content">
		<image class="headicon" v-bind:src="userinfo.headicon" mode=""></image>
		<text class="title">{{userinfo.username}}</text>
		<view class="entry-wrap">
			<view class="entry">个人信息</view>
			<view class="entry">订单列表</view>
			<view class="entry">修改密码</view>
			<view class="entry">意见反馈</view>
		</view>
		<button type="primary" size="default" style="width: 90%;">退出</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: '食物APP是一个用来展示美食的平台',
				userinfo:{
					userid:'001',
					headicon:'/static/head.png',
					username:'tom'
				}
			}
		},
		onLoad() {

		},
		methods: {

		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.headicon{
		width: 200rpx;
		height: 200rpx;
		margin-top: 80rpx;
		margin-bottom: 50rpx;
		border-radius: 50%;
	}
	.title{
		font-size: 36rpx;
	}
	.entry-wrap{
		/* background-color: #CCC; */
		width: 90%;
		margin-top: 30rpx;
		margin-bottom: 30rpx;
	}
	.entry{
		height: 3em;
		line-height: 3em;
		text-align: left;
		border-bottom: #CCC solid 1px;
		position: relative;
	}
	
	.entry::after{
		content: '';
		width: 50rpx;
		height: 50rpx;
		background-image: url(../../static/more.png);
		background-size: contain;
		position: absolute;
		right: 0rpx;
		top:0.5em
	}
	.entry:first-child{
	/* 	background-color: #007AFF; */
		border-top: #CCC solid 1px;
	}
	
	
</style>
